<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>帖子</title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/font-awesome-4.3.0/css/font-awesome.min.css" />
		<link href="../css/config.css" rel="stylesheet" />
		<link href="../css/base.css" rel="stylesheet" />
		<link href="../css/index.css" rel="stylesheet" />
		<link href="../css/circle.css" rel="stylesheet" />
		<style>
			.mui-backdrop {
				background-color: rgba(0, 0, 0, 0)!Important;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav km-navbar white-header" style="box-shadow:none;">
			<a class="mui-icon mui-icon-back mui-pull-left mui-action-back"></a>
			<div class="header-tabbar">
				<div id="segmentedControl" class="mui-segmented-control">
					<a class="mui-control-item mui-active" href="#item1">
                          	   全部
                        </a>
					<a class="mui-control-item" href="#item2">
                          	  楼主
                        </a>
				</div>
			</div>
			<a class="mui-icon mui-icon-bars mui-pull-right" href="#pop-rightTop"></a>

		</header>
		<div class="mui-content3" style="padding-bottom:50px;">
			<div class="post-master">
				<!--患者主页为circle/circle-member-center,医生主页为view/doctor-detail.html-->
				<a class="img-a" ontouchstart='openWindow("../view/doctor-detail.html", "../view/doctor-detail.html");'><img src="../img/example1.png" /></a>
				<dl><dt>王医生<span>楼主</span></dt>
					<dd>内科</dd>
				</dl>
				<!--关注后文字变成已关注-->
				<a class="guanzhu" ontouchstart="guanzhu()">关注</a>
				<span class="time">02-18&nbsp;12:44</span>
			</div>
			<p class="post-title"><span class="jhPost">精</span>22肠道微生态与功能性胃肠病肠道微生态与功能性胃肠病肠道微生态与功能性胃肠病</p>
			<a class="mui-icon fav favButton" id="favButton"><i class="fa fa-star" style="top:0px!important;"></i></a>
			<div class="post-header">
				<a class="post-circle-name">内科圈<i class="fa fa-angle-right"></i></a>
				<span class="post-info1"><i class="fa fa-commenting-o"></i>23</span>
				<span class="post-info1"><i class="fa fa-eye"></i>13</span>
			</div>
			<div class="post-content">
				<img src="../img/example4.jpg" />
				<p class="para">
					转眼之间，2015年已成为过去。在过去一年中，全球胃肠病学研究者和临床医生在肠道微生态、早癌内镜诊治、炎症性肠病等领域硕果累累。为更好应对2016年的机遇和挑战，本刊编辑特邀我国知名学者梳理了2015年消化肝病领域研究热点与亮点，与读者分享。本期首先介绍肠道微生态与功能性胃肠病研究进展，内容详见D2~D3版。</p>
				<p class="para">2015年美国汤森路透“引文桂冠奖”(医学组)颁发给了美国华盛顿大学戈登(JeffreyI.Gordon)教授，以表彰其团队在验证人类肠道微生物群落与人类生理、代谢及营养关系方面作出的重要贡献。</p>
				<p class="para"> 为更好理解肠道菌群与人体健康之间的微妙关系，我们特邀北京协和医院消化内科柯美云教授介绍正常肠道菌群的功能、菌群紊乱与消化疾病的关系，以及影响脑-肠-肠道微生态正常互动的多种因素。</p>
			</div>
			<!--回复部分,
				先按点赞数量从多到少排，剩下的按回复时间排
				只显示10条，后面上拉加载
			-->

			<ul class="post-comment-area" id="post-comment-area">
				<li>
					<div class="post-master">
						<a class="img-a" ontouchstart='openWindow("../view/doctor-detail.html", "../view/doctor-detail.html");'><img src="../img/example1.png" /></a>
						<dl><dt>李医生</dt>
							<dd>内科</dd>
						</dl>
						<a class="louceng"><i class="fa fa-thumbs-up"></i>25</a>
						<span class="time">02-18&nbsp;12:44&nbsp;&nbsp;100楼</span>
					</div>
					<div class="para ">回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复</div>
					<a class="huifu" href="#replyPopover"><i class="fa fa-commenting-o"></i>回复</a>
				</li>
				<li>
					<div class="post-master">
						<a class="img-a" ontouchstart='openWindow("../view/doctor-detail.html", "../view/doctor-detail.html");'><img src="../img/example1.png" /></a>
						<dl><dt>李医生</dt>
							<dd>内科</dd>
						</dl>
						<a class="louceng"><i class="fa fa-thumbs-up"></i>5</a>
						<span class="time">02-18&nbsp;12:44&nbsp;&nbsp;10楼</span>
					</div>
					<div class="para ">回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复</div>
					<a class="huifu" href="#replyPopover"><i class="fa fa-commenting-o"></i>回复</a>
				</li>
				<li>
					<div class="post-master">
						<a class="img-a" ontouchstart='openWindow("../view/doctor-detail.html", "../view/doctor-detail.html");'><img src="../img/example1.png" /></a>
						<dl><dt>李医生</dt>
							<dd>内科</dd>
						</dl>
						<a class="louceng"><i class="fa  fa-thumbs-o-up"></i></a>
						<span class="time">02-18&nbsp;12:44&nbsp;&nbsp;1楼</span>
					</div>
					<div class="para ">回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复</div>
					<a class="huifu" href="#replyPopover"><i class="fa fa-commenting-o"></i>回复</a>
				</li>
				<li>
					<div class="post-master">
						<a class="img-a" ontouchstart='openWindow("../view/doctor-detail.html", "../view/doctor-detail.html");'><img src="../img/example1.png" /></a>
						<dl><dt>李医生</dt>
							<dd>内科</dd>
						</dl>
						<a class="louceng"><i class="fa  fa-thumbs-o-up"></i></a>
						<span class="time">02-18&nbsp;12:44&nbsp;&nbsp;2楼</span>
					</div>
					<div class="para ">回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复</div>
					<div class="yinyong">
						<p><span>王医生</span>3楼</p>
						<div class="para">回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复回复</div>
					</div>
					<a class="huifu" href="#replyPopover"><i class="fa fa-commenting-o"></i>回复</a>
				</li>
			</ul>
			<!--回复部分 end-->
			<!--底部回复控件-->
			<div class="reply-box">
				<a class="reply-input-outer" href="#replyPopover">
					<p>回复作者</p>
				</a>
			</div>
			<!--底部回复控件end-->
		</div>
		<!--回复popover-->
		<div id="replyPopover" class="mui-popover replyPopover">
			<div class="mui-popover-arrow"></div>
			<div class="mui-scroll-wrapper">
				<div class="mui-scroll">
					<header class="mui-bar mui-bar-nav km-navbar white-header" style="box-shadow:none;">
						<a class="mui-icon mui-icon-back mui-pull-left" ontouchstart="closePopover()"></a>
						<h1 id="title" class="mui-title km-view-title">回复</h1>
						<a class="mui-pull-right header-text">发表</a>
					</header>
					<div class="mui-content3">
						<textarea class="post-textarea" placeholder="请输入内容或者插入图片" autoHeight="true"></textarea>
					</div>
				</div>
				<div class="post-imgAdd">
					<img src="../img/example1.png" />
					<a class="addButton"><i class="mui-icon mui-icon-plusempty"></i></a>
				</div>
			</div>
		</div>

		<!--右上角菜单popover-->
		<div id="pop-rightTop" class="mui-popover pop-postMenu2">
				<ul>
					<li><a>升为精华</a></li>
					<li><a>删除该贴</a></li>
				</ul>
		</div>
	</body>
	<script src="../js/mui.min.js"></script>
	<script src="../js/Global.js"></script>
	<script src="../js/zepto.min.js"></script>
	<script>
		mui.init({
			swipeBack: true,
			statusBarBackground: '#f7f7f7',
			statusBarStyle: 'UIStatusBarStyleDefault'
		});
		mui('.mui-scroll-wrapper').scroll();
		document.getElementById("favButton").ontouchstart = function(event) {
			if ($("#favButton").hasClass("fav")) {
				$("#favButton").removeClass("fav");
				$("#favButton").children("i").removeClass("fa-star").removeClass("fa-star-o").addClass("fa-star-o");
			} else {
				$("#favButton").addClass("fav");
				$("#favButton").children("i").removeClass("fa-star-o").removeClass("fa-star").addClass("fa-star");
			}
		}

		function closePopover() {
			mui('#replyPopover').popover('toggle');
		}
		//==================textarea自适应高度============================================
		$.fn.autoHeight = function() {
			function autoHeight(elem) {
				elem.style.height = 'auto';
				elem.scrollTop = 0; //防抖动
				elem.style.height = elem.scrollHeight + 'px';
			}
			this.each(function() {
				autoHeight(this);
				$(this).on('keyup', function() {
					autoHeight(this);
				});
			});
		}
		$('textarea[autoHeight]').autoHeight();
		//============关注===================================
		function guanzhu() {
			var rs = $(event.currentTarget);
			if (rs.hasClass("yiguanzhu")) {
				rs.text("关注");
			} else {
				rs.text("已关注");
			}
			rs.toggleClass("yiguanzhu");
		}
	</script>

</html>